﻿<%@ Page Title="Quản lí xã, phường" Language="C#" MasterPageFile="~/Views/MasterPageViews.master"
    AutoEventWireup="true" CodeFile="LocationCommunes.aspx.cs" Inherits="Views_LocationCommunes" %>

<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<asp:Content ID="ContentHeader" ContentPlaceHolderID="head" runat="Server">
</asp:Content>
<asp:Content ID="ContentChange" ContentPlaceHolderID="ContentPlaceHolderChange" runat="Server">
    <h3 class="header-title">
        <ext:Label StyleHtmlCls="lable-message" StyleHtmlContent="true" ID="lblHeader" runat="server"
            Text="Quản lí phường xã" Icon="ApplicationLightning" />
    </h3>
    <div class="content-sub">
        <ext:Toolbar ID="ToolbarFunctions" runat="server">
            <Items>
                <ext:Button ID="btnToobarAdd" runat="server" Text="Thêm mới" Icon="Add" OnDirectClick="btnToobarAdd_DirectClick" />
                <ext:Button ID="btnToobarUpdate" runat="server" Text="Chỉnh sửa" Icon="Pencil" OnDirectClick="btnToobarUpdate_DirectClick" />
                <ext:Button ID="btnToobarDelete" runat="server" Text="Xóa" Icon="Delete" />
                <ext:Button ID="btnToobarHelp" runat="server" Text="Hỗ trợ" Icon="Help" />
                <ext:Button ID="btnToobarHomePage" runat="server" Text="Quản lí chính" Icon="House" />
            </Items>
        </ext:Toolbar>

        <!--Store find data-->
        <ext:Store
            ID="StoreCommunes"
            runat="server"
            OnReadData="StoreCommunes_ReadData"
            PageSize="10" Buffered="False">
            <Model>
                <ext:Model ID="ModelStoreCommunes" runat="server" IDProperty="ComID">
                    <Fields>
                        <ext:ModelField Name="ComID" />
                        <ext:ModelField Name="NameOfComm" />
                        <ext:ModelField Name="StatusOfComm" />
                        <ext:ModelField Name="Expr2" />
                        <ext:ModelField Name="Expr1" />
                        <ext:ModelField Name="ProvID" />
                        <ext:ModelField Name="NameOfProvince" />
                    </Fields>
                </ext:Model>
            </Model>
        </ext:Store>

        <!--Content data GridPanel-->
        <ext:GridPanel
            ID="GridPanelCommunes"
            runat="server"
            StoreID="StoreCommunes"
            Height="300"
            Title="Danh sách phường xã hiện có">
            <ColumnModel ID="ColumnModelCommunes" runat="server">
                <Columns>
                    <ext:Column ID="Col_ComID" runat="server" Text="ID" DataIndex="ComID" />
                    <ext:Column ID="Col_NameOfComm" runat="server" Text="Tên xã phường" DataIndex="NameOfComm" Flex="1" />
                    <ext:CheckColumn ID="Col_StatusOfComm" runat="server" Text="Trạng thái" DataIndex="StatusOfComm" />
                    <ext:Column ID="Col_DistID" runat="server" Text="Khóa quận, huyện" DataIndex="Expr2" />
                    <ext:Column ID="Col_NameOfDist" runat="server" Text="Tên quận huyện" DataIndex="Expr1" />
                    <ext:Column ID="Col_ProvID" runat="server" Text="Khóa tỉnh thành" DataIndex="ProvID" />
                    <ext:Column ID="Col_NameOfProvince" runat="server" Text="Tên tỉnh thành" DataIndex="NameOfProvince" />
                </Columns>
            </ColumnModel>
            <SelectionModel>
                <ext:RowSelectionModel ID="RowSelectionModelCommunes" runat="server" Mode="Single">
                    <DirectEvents>
                        <Select OnEvent="RowSelected" Buffer="250" />
                    </DirectEvents>
                </ext:RowSelectionModel>
            </SelectionModel>
            <BottomBar>
                <ext:PagingToolbar StoreID="StoreCommunes" ID="PagingToolbarCommunes" runat="server"
                    AfterPageText="của {0}" BeforePageText="Trang" DisplayMsg="Hiển thị bản ghi {0} - {1} của {2}"
                    EmptyMsg="Chưa có dữ liệu" FirstText="Trang đầu tiên" LastText="Trang cuối cùng"
                    NextText="Trang kế tiếp" PrevText="Trang trước" RefreshText="Làm mới" />
            </BottomBar>
        </ext:GridPanel>

        <!-- Cửa sổ popup thêm mới xã phường-->
        <ext:Window
            ID="WindowAddCommunes"
            runat="server"
            Title="Thêm mới xã phường"
            Icon="Add"
            Height="250"
            Width="350"
            BodyStyle="background-color: #fff;"
            Modal="true"
            ShadowMode="Drop"
            Hidden="true">
            <Content>
                <ext:Toolbar ID="ToolbarAddCommunes" runat="server">
                    <Items>
                        <ext:Button ID="btnAdd" runat="server" Text="Lưu lại" Icon="Disk" OnDirectClick="btnAdd_DirectClick" />
                        <ext:Button ID="btnAddCancel" runat="server" Text="Hủy bỏ" Icon="Delete" OnDirectClick="btnAddCancel_DirectClick" />
                    </Items>
                </ext:Toolbar>
                <div class="content-popup-style">
                    <div class="view-msg-popup">
                        <ext:Label ID="lblFormAddCommunes" runat="server" StyleHtmlContent="True" Cls="lable-message-error" />
                    </div>
                    <div>
                        <ext:SelectBox
                            ID="cbxProvinces"
                            runat="server"
                            DisplayField="NameOfProvince"
                            ValueField="ProvID"
                            EmptyText="Lựa chọn"
                            FieldLabel="Tỉnh thành"
                            Width="310"
                            MarginSpec="8 0 8 0">
                            <Store>
                                <ext:Store ID="StoreProvinces" runat="server">
                                    <Model>
                                        <ext:Model ID="ModelProvinces" runat="server">
                                            <Fields>
                                                <ext:ModelField Name="ProvID" />
                                                <ext:ModelField Name="NameOfProvince" />
                                            </Fields>
                                        </ext:Model>
                                    </Model>
                                </ext:Store>
                            </Store>
                            <Listeners>
                                <%-- Gọi sự kiện [DirectMethod] cbxProvinces_SelectedChange() khi thay đổi giá trị cbxProvinces --%>
                                <Select Handler="App.direct.cbxProvinces_SelectedChange();" />
                            </Listeners>
                        </ext:SelectBox>

                        <ext:SelectBox
                            ID="cbxDistricts"
                            runat="server"
                            DisplayField="NameOfDist"
                            ValueField="DistID"
                            EmptyText="Lựa chọn"
                            FieldLabel="Quận huyện"
                            Width="310"
                            MarginSpec="8 0 8 0">
                            <Store>
                                <ext:Store ID="StoreDistricts" runat="server">
                                    <Model>
                                        <ext:Model ID="ModelDistricts" runat="server">
                                            <Fields>
                                                <ext:ModelField Name="DistID" />
                                                <ext:ModelField Name="NameOfDist" />
                                            </Fields>
                                        </ext:Model>
                                    </Model>
                                </ext:Store>
                            </Store>
                        </ext:SelectBox>
                        <ext:TextField ID="txtFormAddName" runat="server" FieldLabel="Tên xã phường" Width="310" MarginSpec="8 0 8 0" />
                        <ext:Checkbox ID="chkFormAddStatus" runat="server" FieldLabel="Trạng thái" BoxLabel="Cho phép hoạt động"
                            MarginSpec="8 0 8 0" />
                    </div>
                </div>
            </Content>
        </ext:Window>

        <!-- Cửa sổ popup cập nhật xã phường-->
        <ext:Window
            ID="WindowUpdateCommunes"
            runat="server"
            Title="Cập nhật thông tin xã phường"
            Icon="ApplicationEdit"
            Height="250"
            Width="350"
            BodyStyle="background-color: #fff;"
            Modal="true"
            ShadowMode="Drop"
            Hidden="true">
            <Content>
                <ext:Toolbar ID="ToolbarUpdateCommunes" runat="server">
                    <Items>
                        <ext:Button ID="ButtonUpdateCommunes" runat="server" Text="Lưu lại" Icon="Disk" OnDirectClick="ButtonUpdateCommunes_DirectClick" />
                        <ext:Button ID="ButtonUpdateCancel" runat="server" Text="Hủy bỏ" Icon="Delete" OnDirectClick="ButtonUpdateCancel_DirectClick" />
                    </Items>
                </ext:Toolbar>
                <div class="content-popup-style">
                    <div class="view-msg-popup">
                        <ext:Label ID="lblUpdateMsg" runat="server" StyleHtmlContent="True" Cls="lable-message-error" />
                    </div>
                    <div>
                        <ext:TextField ID="TextUpdateProvinceName" runat="server" FieldLabel="Tỉnh thành" Disabled="true" Width="310" MarginSpec="8 0 8 0" />
                        <ext:TextField ID="TextUpdateDistrictsName" runat="server" FieldLabel="Quận huyện" Disabled="true" Width="310"
                            MarginSpec="8 0 8 0" />
                        <ext:TextField ID="TextUpdateName" runat="server" FieldLabel="Tên xã phường" Width="310" MarginSpec="8 0 8 0" />
                        <ext:Checkbox ID="CheckboxUpdateStatus" runat="server" FieldLabel="Trạng thái" BoxLabel="Cho phép hoạt động"
                            MarginSpec="8 0 8 0" />
                    </div>
                </div>
            </Content>
        </ext:Window>
    </div>

    <!-- Display information details -->
    <div class="view-info-record">
        <h3 class="header-title">
            <ext:Label ID="lblHeaderViewInfomations" StyleHtmlCls="lable-message" StyleHtmlContent="true"
                runat="server" Text="Hiển thị thông tin chi tiết dạng bảng" Icon="Information" />
        </h3>
        <div class="content-info">
            <table>
                <tr>
                    <td class="with-td-view-info">ID phường xã:
                    </td>
                    <td>
                        <ext:Label ID="lblViewComID" runat="server" />
                    </td>
                </tr>
                <tr>
                    <td class="with-td-view-info">Tên xã, phường:
                    </td>
                    <td>
                        <ext:Label ID="lblViewNameOfComm" runat="server" />
                    </td>
                </tr>
                <tr>
                    <td class="with-td-view-info">Trạng thái:
                    </td>
                    <td>
                        <ext:Checkbox ID="chkViewStatusOfComm" runat="server" />
                    </td>
                </tr>
                <tr>
                    <td class="with-td-view-info">Thuộc quận, huyện:
                    </td>
                    <td>
                        <ext:Label ID="lblViewNameOfDist" runat="server" />
                    </td>
                </tr>
                <tr>
                    <td class="with-td-view-info">Thuộc tỉnh thành:
                    </td>
                    <td>
                        <ext:Label ID="lblViewNameOfProvince" runat="server" />
                    </td>
                </tr>
            </table>
        </div>
    </div>
    <!-- Gird-View Scripts -->
    <script>
        var template = '<span style="color:{0};">{1}</span>';

        var change = function (value) {
            return Ext.String.format(template, (value > 0) ? "green" : "red", value);
        }

        var pctChange = function (value) {
            return Ext.String.format(template, (value > 0) ? "green" : "red", value + "%");
        }
    </script>
</asp:Content>
